﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RoleInfoPage.aspx.cs" Inherits="Easy.Web.Pages.PrivilegePages.RoleInfoPage" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head id="Head1" runat="server">
    <title></title>
    <link href="/_css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="/_css/common.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="/_css/iconfont.css" />
    <script src="/_js/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="/_js/bootstrap.min.js" type="text/javascript"></script>
    <script src="/_js/json2.js" type="text/javascript"></script>
    <script src="/_js/custom.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {


            //hiddenrow
            var roleId= $("#RoleId").val();
            if (roleId != "") {
                $("#btn_saveRole").hide();
                $("#BusinessUnitSelect").hide();
                GetEnitityListForRole();
                GetSiteMapForRole(roleId);
            } else {
                $("#hiddenrow").hide();
                $("#BusinessUnit").hide();
                $("#btn_updateRole").hide();
                GetBusinessUnitList();
               
            }
            $('.roleIco').on('click', function () {

                if ($(this).attr("p") == "0") {
                    $(this).attr("src", role_ico["1"]);
                    $(this).attr("p", "1");
                }
                else if ($(this).attr("p") == "1") {
                    $(this).attr("src", role_ico["2"]);
                    $(this).attr("p", "2");
                }
                else if ($(this).attr("p") == "2") {
                    $(this).attr("src", role_ico["4"]);
                    $(this).attr("p", "4");
                }
                else if ($(this).attr("p") == "4") {
                    $(this).attr("src", role_ico["8"]);
                    $(this).attr("p", "8");
                }
                else if ($(this).attr("p") == "8") {
                    $(this).attr("src", role_ico["0"]);
                    $(this).attr("p", "0");
                }
            });

            //站点图checkbox的变更
            $('input[type=checkbox]').on('click', function () {
                if ($(this).attr("chk") == 0) {
                    $(this).prop('checked', true);
                    $(this).attr("chk","1");
                }
                else if($(this).attr("chk")==1) {
                    $(this).prop('checked', false);
                    $(this).attr("chk","0");
               }
           });
        });

        function GetEnitityListForRole() {
            $.ajax({
                url: "/Service/Privilege/GetEntityRoleList.ashx",
                async: false,
                type: "post",
                dataType: "JSON",
                data: { "RoleId": $("#RoleId").val()
                },
                success: function (data, textStatus) {

                    var SMShtml = "<table class='table table-hover'>"
                        + " <thead><tr><th>#</th><th>实体</th><th><span>创建"
                                           + "  </span></th><th><span>读</span></th><th><span>写</span></th>"
                                            + "<th><span>删除</span></th><th><span>分派</span></th>"
                                           + "</tr></thead><tbody>";

                    for (var i = 0; i < data.length; i++) {

                        var item = data[i];
                        SMShtml += "<tr entityId='" + item.EntityId + "'  name='list' id=\"" + (i + 1) + "\">"
                        /*NO*/ + "<td>" + (i + 1) + "</td>"
                    + "<td  id=\"list" + (i + 1) + "\"><span>" + item.EntityName + "</span></td>"
                      + "<td   id=\"list" + (i + 1) + "\"><img class='roleIco' src='" + role_ico[item.Create] + "' Read='Read' p='" + item.Create + "' ></td>"
                     + "<td   id=\"list" + (i + 1) + "\"><img class='roleIco' src='" + role_ico[item.Read] + "' Read='Read' p='" + item.Read + "' ></td>"
                   + "<td   id=\"list" + (i + 1) + "\"><img class='roleIco'  src='" + role_ico[item.Write] + "' Write='Write' p='" + item.Write + "' ></td>"
                    
                        + "<td   id=\"list" + (i + 1) + "\"><img  class='roleIco' src='" + role_ico[item.Delete] + "' Delete='Delete' p='" + item.Delete + "' ></td>"
                         + "<td   id=\"list" + (i + 1) + "\"><img  class='roleIco' src='" + role_ico[item.Assign] + "' Assign='Assign' p='" + item.Assign + "' ></td>"
                    
                            + "</tr>";


                    }

                   
                    SMShtml += "</tbody></table>";
                    $("#entityList_div").html(SMShtml);

                    //横向绑定
                    $(".table tbody span").on('click', function () {
                        var row_ico = $(this).parent().siblings().find(".roleIco");
                        var row_arr = [];
                        for (var i = 0; i < row_ico.length; i++) {
                            var row_p = row_ico[i];
                            row_arr.push($(row_p).attr("p"));
                        }
                        var p_min = Math.min.apply(null, row_arr);//获取同一行中最小的p的值
                        for (j = 0; j < row_ico.length; j++) {
                            if ($(row_ico).eq(j).attr("p") == p_min) {
                                if (p_min == "0") {
                                    $(row_ico).eq(j).attr("src", role_ico["1"]);
                                    $(row_ico).eq(j).attr("p", "1");
                                }
                                else if (p_min == "1") {
                                    $(row_ico).eq(j).attr("src", role_ico["2"]);
                                    $(row_ico).eq(j).attr("p", "2");
                                }
                                else if (p_min == "2") {
                                    $(row_ico).eq(j).attr("src", role_ico["4"]);
                                    $(row_ico).eq(j).attr("p", "4");
                                }
                                else if (p_min == "4") {
                                    $(row_ico).eq(j).attr("src", role_ico["8"]);
                                    $(row_ico).eq(j).attr("p", "8");
                                }
                                else if (p_min == "8") {
                                    $(row_ico).eq(j).attr("src", role_ico["0"]);
                                    $(row_ico).eq(j).attr("p", "0");
                                }
                            }
                        }
                    });



                    //列绑定
                    $(".table thead span").on('click',function () {
                        var index = $(this).parent().index();
                        var tr_row = $(".table tbody tr");
                        var col_arr = [];
                        for (var i = 0; i < tr_row.length; i++) {
                            var col = tr_row[i]; 
                            var col_p = $(col).children("td").eq(index).find(".roleIco");
                            col_arr.push($(col_p).attr("p"));
                        }
                        var col_min = Math.min.apply(null, col_arr);//获取同一列中最小的p的值
                        for (var j = 0; j < tr_row.length; j++) {
                            var p = $(tr_row).eq(j).children("td").eq(index).find(".roleIco");
                            if ($(p).attr("p") == col_min) {
                                if (col_min == "0") {
                                    $(p).attr("src", role_ico["1"]);
                                    $(p).attr("p", "1");
                                }
                                else if (col_min == "1") {
                                    $(p).attr("src", role_ico["2"]);
                                    $(p).attr("p", "2");
                                }
                                else if (col_min == "2") {
                                    $(p).attr("src", role_ico["4"]);
                                    $(p).attr("p", "4");
                                }
                                else if (col_min == "4") {
                                    $(p).attr("src", role_ico["8"]);
                                    $(p).attr("p", "8");
                                }
                                else if (col_min == "8") {
                                    $(p).attr("src", role_ico["0"]);
                                    $(p).attr("p", "0");
                                }
                            }

                        }
                    });



                },
                error: function (data, textStatus) {
                    alert("ajax错误");

                }

            });

        }

        //站点图
        function GetSiteMapForRole(roleId) {
            $.ajax({
                url: "/Service/Privilege/SiteMap.ashx",
                async: false,
                type: "post",
                dataType: "JSON",
                data: {
                    RoleId: roleId
                },
                success: function (data) {
                    var str2 = "";
                    for (var i = 0; i < data.length; i++) {
                        if (i == 0) {
                            if (data[i].Privilege==0){
                                str2 += " <dd> <div  class='title'><input type='checkbox' name='father' chk='" + data[i].Privilege + "' SiteMapId='" + data[i].SiteMapId + "'/>" + data[i].Name + "</div><ul class='menuson'>"
                            } else if (data[i].Privilege == 1) {
                                str2 += " <dd> <div  class='title'><input type='checkbox' name='father' checked='checked' chk='" + data[i].Privilege + "' SiteMapId='" + data[i].SiteMapId + "'/>" + data[i].Name + "</div><ul class='menuson'>"
                            }
                        } else {
                            
                            if (data[i].Privilege==0){
                                str2 += " </ul></dd><dd> <div  class='title'><input type='checkbox' name='father' chk='" + data[i].Privilege + "' SiteMapId='" + data[i].SiteMapId + "'/>" + data[i].Name + "</div><ul class='menuson'>"
                            } else if (data[i].Privilege == 1) {
                                str2 += " </ul></dd><dd> <div  class='title'><input type='checkbox' name='father' checked='checked' chk='" + data[i].Privilege + "' SiteMapId='" + data[i].SiteMapId + "'/>" + data[i].Name + "</div><ul class='menuson'>"
                            }
                        }

                        
                        for (var j = 0; j < data[i].ChildSiteMap.length; j++) {
                           
                            if (data[i].ChildSiteMap[j].Privilege == 0) {
                                str2 += "<li><input type='checkbox' name='son' chk='" + data[i].ChildSiteMap[j].Privilege + "' SiteMapId='" + data[i].ChildSiteMap[j].SiteMapId + "'/>" + data[i].ChildSiteMap[j].Name + "</li>"
                            } else if (data[i].ChildSiteMap[j].Privilege == 1) {
                                str2 += "<li><input type='checkbox' name='son' checked='checked' chk='" + data[i].ChildSiteMap[j].Privilege + "' SiteMapId='" + data[i].ChildSiteMap[j].SiteMapId + "'/>" + data[i].ChildSiteMap[j].Name + "</li>"
                            }
                            

                        }
                        str2 += "</ul></dd>";

                    }

                    $("#list_div").html(str2);

                    //checkbox的二级联动
                    $(".title input").on('click', function () {//父级选中子集全选
                        var check = $(this).prop('checked');
                        if ($(this).prop('checked')) {
                            $(this).parent().siblings().find("input").prop('checked', check);
                            $(this).parent().siblings().find("input").attr('chk', '1');
                        } else {
                            $(this).parent().siblings().find("input").prop('checked', check);
                            $(this).parent().siblings().find("input").attr('chk', '0');
                        }
                    });
                    $("input[name=son]").on('click', function () {//子级有一个选中则父级选中，全部取消则父级取消
                        var son = $(this).parent().parent().children();
                        var flag = 0;
                        for (var i = 0; i < son.length; i++) {

                            if ($(son[i]).find("input").prop('checked') == false) {
                                flag++;
                            }
                        }

                        if (flag == son.length) {
                            $(son).parent().siblings().find("input").prop('checked', false);
                            $(son).parent().siblings().find("input").attr('chk', '0');
                        } else {
                            $(son).parent().siblings().find("input").prop('checked', true);
                            $(son).parent().siblings().find("input").attr('chk', '1');
                        }
                    })

                },
                error: function (data) {
                    alert("ajax错误");
                }
            });

        }

        function GetBusinessUnitList() {
            $.ajax({
                url: "/Service/Privilege/GetBusinessUnit.ashx",
                async: false,
                type: "post",
                dataType: "json",
                data: {
                },
                success: function (data, textStatus) {

                    var SMShtml = "";

                    for (var i = 0; i < data.length; i++) {
                        var item = data[i];
                        SMShtml += "<option value='" + item.OwningBusinessUnit + "'>" + item.Name + "</option>";

                    }



                    $("#BusinessUnitSelect").html(SMShtml);
                  
                },
                error: function (data, textStatus) {
                    alert("ajax错误");

                }

            });

        }

        function btn_update() {
            var update = {};
            update["RoleId"] = $("#RoleId").val();
            update["Name"] = $("#Name").val();
            update["OwningBusinessUnit"] = $("#BusinessUnitId").val();
            update["Desc"] = $("#Desc").val();

            var RolePrivilege = {};
            RolePrivilege["RoleId"] = $("#RoleId").val();
            RolePrivilege["EntityPrivileges"] = [];

            //站点图信息
            var SiteMap = [];

            $("#entityList_div").find("tr[id]").each(function () {
                var item = {};
                item["EntityId"] = $(this).attr("entityId");
                item["EntityName"] = $(this).children().eq(1).find("span").html();


                item["Read"] = $(this).children().eq(3).children().attr("p");
                item["Write"] = $(this).children().eq(4).children().attr("p");
                item["Create"] = $(this).children().eq(2).children().attr("p");
                item["Delete"] = $(this).children().eq(5).children().attr("p");
                item["Assign"] = $(this).children().eq(6).children().attr("p");

                RolePrivilege["EntityPrivileges"].push(item);
            });

            //站点图修改后信息
            $("#list_div").find("input[type=checkbox]").each(function () {
                var checkbox = {};
                if ($(this).prop('checked')) {
                    checkbox["SiteMapName"]=$(this).parent().text();
                    checkbox["SiteMapId"] = $(this).attr("SiteMapId");
                    checkbox["SiteMapchk"] = $(this).attr("chk");
                    SiteMap.push(checkbox);
                }

                
            });
            
            $.ajax({
                url: "/Service/Privilege/UpdateRole.ashx",
                async: false,
                type: "post",
                dataType: "JSON",
                data: { "role": JSON.stringify(update),
                    "RolePrivilege": JSON.stringify(RolePrivilege),
                    "SiteMap": JSON.stringify(SiteMap)
                     
                },
                success: function (data, textStatus) {
                    
                    

                    if (data.Result == "0") {
                        location.reload();
                    }
                    else {
                        alert(data.Remark);
                    }

                },
                error: function (data, textStatus) {
                    alert("错误");

                }

            });
        }

        function btn_return() {
            window.location = "RoleListPage.aspx";
        }

       
        function btn_save() {
            var add = {};
            add["Name"] = $("#Name").val();
            add["OwningBusinessUnit"] = $("#BusinessUnitSelect").val();
            add["BusinessUnit"] = $("#BusinessUnitSelect option:selected").text();
            $.ajax({
                url: "/Service/Privilege/Role.ashx",
                async: false,
                type: "post",
               dataType:"json",
                data: {
                    "role": JSON.stringify(add),
                    "optionType":1,
                    "optionUser": "05e3362c-860e-411c-a1dc-32330b61b632"

                },
                success: function (data, textStatus) {
                    
                    // alert("success");
                    if (data.Result == "0") {
                        location.href = "/Pages/PrivilegePages/RoleInfoPage.aspx?Id=" + data.Remark;
                        
                    } else {
                        alert(data.Remark);
                    }
                      

                },
                error: function (data, textStatus) {
                    alert("错误");

                }

            });

        }


    </script>
    <style>
        *{list-style:none;}
        .page-header{margin:15px;}
        .page-header+.btn-primary{margin:0px 15px 10px 5px;}
        .panel-heading{padding:3px 15px;height:40px;line-height:34px;}
        tbody tr td img{cursor:pointer;}
        .table thead tr th span{cursor:pointer;}
        .table tbody tr td span{cursor:pointer;}
        #hiddenrow label{font-weight:normal;}
        #hiddenrow .panel-heading{padding:0px 15px;}
        #hiddenrow input{margin-right:5px;}
        
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div class="">
        <div class="row">
            <div class="col-lg-12">
                <input id="RoleId" type="hidden" value="<%=role.RoleId %>" />
                <input id="BusinessUnitId" type="hidden" value="<%=role.OwningBusinessUnit %>" />
            
                <h1 class="page-header">
                    角色信息</h1>
                <button type='button' style="float: right" id='btn_back' class='btn btn-primary ng-binding'
                    onclick="btn_return();">
                    返回角色列表</button>
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        角色基本信息
                        <button type='button' style="float: right" id='btn_updateRole' class='btn btn-primary ng-binding'
                            onclick="btn_update();">
                            修改</button>
                        <button type='button' style="float: right;" id='btn_saveRole' class='btn btn-primary ng-binding' 
                            onclick="btn_save();">
                            保存</button>
                    </div>
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <div class="form-group">
                            <label for="Name">
                                角色名称</label>
                            <input type="text" class="form-control" id="Name" value="<%= role.Name %>" />
                        </div>
                        <div class="form-group">
                            <label for="BusinessUnit">
                                部门</label>
                            <input type="text" disabled="disabled" class="form-control" id="BusinessUnit" value="<%= role.BusinessUnit %>" />
                           
                        <div class="form-group" id="BusinessUnitDiv">                  
                             <select class="form-control" id="BusinessUnitSelect">
                            </select>
                        </div>
     
                        </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.panel-body -->
                </div>
                <!-- /.panel -->
            </div>
        </div>
        <div id="hiddenrow" class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <ul class="nav nav-tabs">
                            
                            <li role="presentation" class="active"><a href="#entityList_div" data-toggle="tab">自定义实体</a></li>
                            <li role="presentation"><a href="#list_div" data-toggle="tab">站点图</a></li>
                        </ul>
                    </div>
                    <!-- /.panel-heading -->
                    <div class="panel-body tab-content ">
                          
                        <div id="entityList_div" class="table-responsive tab-pane fade in active">

                        </div>
                      
                        <div id="list_div" class="tab-pane fade in">

                            </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.panel-body -->
                </div>
                <!-- /.panel -->
            </div>
        </div>
    </div>
    </form>
</body>
</html>
